<template>
  <el-dialog
    :title="isEdit ? '修改' : '新增'"
    :visible.sync="dialogVisible"
    width="70%"
   
    customClass="customWidth"
  >
    <el-form
      :model="ruleForm"
      :rules="rules"
      ref="ruleForm"
      label-width="200px"
    >
    <el-row :gutter="20">
        <el-col :span="50">
          <el-form-item label="工作面编号" prop="gzmnum">
            <el-input v-model="ruleForm.gzmnum"></el-input>
          </el-form-item>
        </el-col>
   
      
        <el-col :span="50">
          <el-form-item label="工作面名称" prop="gzmname">
            <el-input v-model="ruleForm.gzmname"></el-input>
          </el-form-item>
        </el-col>
   
    
        <el-col :span="50">
          <el-form-item label="工作面类型" prop="gzmtype">
            <el-select v-model="ruleForm.gzmtype" placeholder="请选择工作面类型">
              <el-option
                v-for="item in GzmType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="50">
          <el-form-item label="使用标识" prop="sytag">
            <el-input v-model="ruleForm.sytag"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="50">
          <el-form-item label="走向长" prop="Strikelength">
            <el-input v-model="ruleForm.Strikelength"></el-input>
          </el-form-item>
        </el-col>
   
   
        <el-col :span="50">
          <el-form-item label="倾向长" prop="PropensitytoGrow">
            <el-input v-model="ruleForm.PropensitytoGrow"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      
       
    
      <el-row :gutter="20">
        <el-col :span="50">
          <el-form-item label="煤层厚度" prop="Seamthickness">
            <el-input v-model="ruleForm.Seamthickness"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="50">
          <el-form-item label="煤层倾角" prop="Coalseaminclination">
            <el-input v-model="ruleForm.Coalseaminclination"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="50">
          <el-form-item label="平均埋深" prop="Meanburieddepth">
            <el-input v-model="ruleForm.Meanburieddepth"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="50">
          <el-form-item label="上顺槽名称" prop="Followname">
            <el-input v-model="ruleForm.Followname"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="50">
          <el-form-item label="下顺槽名称" prop="Downname">
            <el-input v-model="ruleForm.Downname"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" :loading="loading" @click="save"
        >确定</el-button
      >
    </span>
  </el-dialog>
</template>

<script>
import { Message } from "element-ui";
import {
  dingbanpeizhigongzuomianadd,
  dingbanpeizhigongzuomianxiu,
} from "../../../https/api/user";
const ruleForm = {
  gzmnum: "",
  gzmname: "",
  gzmtype: "",
  sytag: "",
  Strikelength: "",
  PropensitytoGrow: "",
  Seamthickness: "",
  Coalseaminclination: "",
  Meanburieddepth: "",
  Followname: "",
  Downname: "",
};
export default {
  data() {
    return {
      dialogVisible: false,
      ruleForm,
      isEdit: false,
      loading: false,
      rules: {
        gzmnum: [
          { required: true, message: "请输入工作面编号", trigger: "blur" },
        ],
        gzmname: [
          { required: true, message: "请输入工作面名称", trigger: "blur" },
        ],
        Followname: [
          { required: true, message: "请输入上顺槽名称", trigger: "blur" },
        ],
        Downname: [
          { required: true, message: "请输入下顺槽名称", trigger: "blur" },
        ],
      },
      GzmType:[
        {
        value:'回采巷',
        label:'回采巷',
      },
      {
        value:'掘进巷',
        label:'掘进巷',
      },
    ]
    };
  },
  methods: {
    show(data) {
      this.isEdit = !!data;
      this.ruleForm = data || ruleForm;
      this.dialogVisible = true;
    },
    async save() {
   



      const api = this.isEdit
        ? dingbanpeizhigongzuomianxiu
        : dingbanpeizhigongzuomianadd;
      try {
        this.loading = true;
        const result = await api(this.ruleForm);
        this.$parent.Onlist();
        this.dialogVisible = false;
        this.$refs.ruleForm.resetFields();
        const message = result
        Message({
          message,
          type: "success",
        });
        console.log(">>>>", result);
      } catch (e) {
        console.log(e);
      } finally {
        this.loading = false;
      }
    },
    
  },
};
</script>

<style scoped lang="less">
.el-select {
  width: 100%;
}
.customWidth {
  width: 30% !important;
  min-width: 100px !important;
}
</style>